/**
 * 可编辑：1. 有 transferPostId 2. 当前用户不在已经审批通过的节点里
 */
import React from 'react';
import { Form } from 'antd';
import Wrap from './Wrap';
import OwnApply from './components/OwnApply';
import BeforeSuperior from './components/BeforeSuperior';
import AfterSuperior from './components/AfterSuperior';
import Hr from './components/Hr';
import Ceo from './components/Ceo';
import GroupCeo from './components/GroupCeo';
import styles from './index.less';

const { Item } = Form;

const Add = () => {
    const formElement = ({ form, btns, location, detail, tailFormItemLayout, user }) => {
        const { query } = location;
        const { isOtherPost, transferPostId, type } = query;
        const { currentProcessTaskInstance, processTaskTemplates, startAssigneeEmployeeId } = detail;
        const { currentEmployeeProcessTaskTemplateId } = detail;
        const { relatedBusinessObject = {}, assigneeEmployeeIds = '', taskPath = '' } = currentProcessTaskInstance;
        let isEdit = !transferPostId || assigneeEmployeeIds.split(',').includes(`${user.id}`); // 是否处于编辑
        let current = transferPostId ? taskPath.length / 3 - 1 : 0; // 当前步骤: 如果是当前节点操作人，则使用 taskPath 判断处于第几步

        // 先判断是不是当前操作节点的用户；如果不是就那 currentEmployeeProcessTaskTemplateId 字段去
        // processTaskTemplates 判断他处于第几步骤
        if (transferPostId) {
            if (!assigneeEmployeeIds.split(',').includes(`${user.id}`)) {
                isEdit = false;
                const findIndex = processTaskTemplates.findIndex(
                    item => item.taskTemplateId === currentEmployeeProcessTaskTemplateId
                );

                if (findIndex !== -1) {
                    // 因为后端无法区分 HR 和 CEO，所以这里写死判断：如果是倒数第二步，让他也可以看最后一步
                    if (detail.processState === 'success' && findIndex === processTaskTemplates.length - 2) {
                        current = processTaskTemplates.length - 1;
                    } else {
                        current = findIndex;
                    }
                }
            }
        }
        if (type === 'company') {
            isEdit = false;
            current = taskPath.length <= 3 ? 0 : taskPath.length / 3 - 2;
        }
        let beforeSuperiorType = 'detail';
        if (isOtherPost && current === 0) {
            beforeSuperiorType = 'other';
        }
        if (isEdit && relatedBusinessObject.startBy === '0' && current === 1) {
            beforeSuperiorType = 'edit';
        }
        if (isEdit && relatedBusinessObject.startBy === '1' && current === 0) {
            beforeSuperiorType = 'edit';
        }
        let ownApplyType = 'detail';
        if (isOtherPost) {
            ownApplyType = 'other';
        } else if (current === 0 && isEdit) {
            ownApplyType = 'edit';
        }
        let extraStep = 0;
        // 如果是他人申请
        if (isOtherPost || relatedBusinessObject.startBy === '1') {
            extraStep = -1;
        }
        const hasOwnApply = transferPostId ? relatedBusinessObject.startBy !== '1' : !isOtherPost;
        const steps = [
            hasOwnApply && (
                <OwnApply
                    user={user}
                    key="ownApply"
                    detail={relatedBusinessObject}
                    type={ownApplyType}
                    form={form}
                    btns={btns}
                />
            ),
            <BeforeSuperior
                hasOwnApply={hasOwnApply}
                current={current}
                location={location}
                user={user}
                key="BeforeSuperior"
                type={beforeSuperiorType}
                form={form}
                btns={btns}
                startAssigneeEmployeeId={startAssigneeEmployeeId}
                detail={relatedBusinessObject}
            />,
            <AfterSuperior
                hasOwnApply={hasOwnApply}
                current={current}
                key="AfterSuperior"
                type={current === 2 + extraStep && isEdit ? 'edit' : 'detail'}
                form={form}
                btns={btns}
                startAssigneeEmployeeId={startAssigneeEmployeeId}
                detail={relatedBusinessObject}
            />,
            <Hr
                key="Hr"
                user={user}
                detail={relatedBusinessObject}
                startAssigneeEmployeeId={startAssigneeEmployeeId}
                type={current === 3 + extraStep && isEdit ? 'edit' : 'detail'}
                form={form}
                btns={btns}
                isSuccess={detail.processState === 'success'}
            />,
            <Ceo
                processState={detail.processState}
                key="Ceo"
                tailFormItemLayout={tailFormItemLayout}
                detail={relatedBusinessObject}
                type={current === 4 + extraStep && isEdit ? 'edit' : 'detail'}
                form={form}
                btns={btns}
            />,
            <GroupCeo
                processState={detail.processState}
                key="GroupCeo"
                tailFormItemLayout={tailFormItemLayout}
                detail={relatedBusinessObject}
                type={current === 5 + extraStep && isEdit ? 'edit' : 'detail'}
                form={form}
                btns={btns}
            />
        ];

        const getState = () => {
            if (
                (current >= steps.length - 2 || (isOtherPost && current === 0)) &&
                isEdit &&
                detail.processState !== 'success'
            ) {
                return (
                    <Item
                        extra="提交后，表明您已同意薪资调整，确认后，员工的薪资将自动调整更新"
                        {...tailFormItemLayout}
                    />
                );
            }
            return null;
        };

        return (
            <div className={!isEdit ? styles.detail : ''}>
                {steps.filter(item => item).slice(0, current + 1)}
                {isEdit && detail.processState !== 'success' && btns}
                {!isOtherPost && isEdit && current > 0 && current < steps.length - 2 && (
                    <Item extra="提交后，表明您已确认以上信息" {...tailFormItemLayout} />
                )}
                {getState()}
            </div>
        );
    };

    return <Wrap formElement={formElement} />;
};

export default Add;
